import React, { useState, useEffect } from 'react';
import { Button } from 'antd';
import { LoadingOutlined } from '@ant-design/icons';
import {
  openNotification_util, checkdatavalid_util_formdata, fetchsync_util,
  resultdata_to_formdata, addkey_for_mxdata, use_dict_byzdmc, use_olreport_bybbbm,
  combile_mxdata_mxcol_util, convertISODateTimeToYYYYMMDDHHMMSS,
  view_item_util,
  checkdatavalid_util_formdata_mx,
} from '../util/util.js'
import Customfielditem_hook from '../newmes/customfielditem_hook.js'
import moment from 'moment'
import 'moment/locale/zh-cn'
import Xm_wlmx_hook from './xm_wlmx_hook.js';
import Xm_fjmx_hook from './xm_fjmx_hook.js';
import Xm_gysmx_hook from './xm_gysmx_hook.js';
import Xm_zbmx_hook from './xm_zbmx_hook.js';
import { SaveOutlined } from '@ant-design/icons';
import {
  use_xmjj_initformdata, use_xmjj_initformdata_view, use_xmjj_wlmx_column_initformdata, use_xm_fjmx_column_initformdata, use_xm_pbmd_column_initformdata,
  use_xmjj_gysmx_column_initformdata, use_xm_gysmx_column_initformdata_add, use_xm_zbmx_column_initformdata, use_xm_gysfj_column_initformdata,
  use_gysyb_bjmx_column_initformdata
} from './use_zbzx_config.js';
moment.locale('zh-cn')
var storage = window.localStorage;
import useStore from '../../useStore.js'
import { dropByCacheKey } from 'react-router-cache-route'
import Xmjj_gysmx_hook from './xmjj_gysmx_hook.js';
import { v4 as uuidv4 } from 'uuid';


const Xmjj_form = () => {
  //动态数据源
  const [dynDatasObject, setdynDatasObject] = useState({
    dict_zbxs: [], query_gys: [], query_ry: [], dict_jjgz: [], dict_wjlx: [], dict_cyqx: []
  })
  const [isloading, setisloading] = useState(true)
  const [wlmxdata, setwlmxdata] = useState([])
  const [fjmxdata, setfjmxdata] = useState([])
  const [gysmxdata, setgysmxdata] = useState([])
  const [zbmxdata, setzbmxdata] = useState([])
  const [gysfjdata, setgysfjdata] = useState([])
  const [gysbjdata, setgysbjdata] = useState([])
  const [pbmddata, setpbmddata] = useState([])
  const [wlmxcolums, setwlmxcolums] = useState(use_xmjj_wlmx_column_initformdata)
  const [fjmxcolums, setfjmxcolums] = useState(use_xm_fjmx_column_initformdata)
  const [gysmxcolums, setgysmxcolums] = useState(use_xmjj_gysmx_column_initformdata)
  const [zbmxcolums, setzbmxcolums] = useState(use_xm_zbmx_column_initformdata)
  const [gysfjcolums, setgysfjcolums] = useState(use_xm_gysfj_column_initformdata)
  const [gysbjcolums, setgysbjcolums] = useState(use_gysyb_bjmx_column_initformdata)
  const [pbmdcolums, setpbmdcolums] = useState(use_xm_pbmd_column_initformdata)
  const [wlmxdelidarr, setwlmxdelidarr] = useState([])
  const [fjmxdelidarr, setfjmxdelidarr] = useState([])
  const [gysmxdelidarr, setgysmxdelidarr] = useState([])
  const [zbmxdelidarr, setzbmxdelidarr] = useState([])
  const [gysfjdelidarr, setgysfjdelidarr] = useState([])
  const [gysbjdelidarr, setgysbjdelidarr] = useState([])
  const [pbmddelidarr, setpbmddelidarr] = useState([])
  const [supplierMap, setSupplierMap] = useState({}) //供应商名称映射
  const [triggerGysmxPopup, setTriggerGysmxPopup] = useState(false) // 触发供应商明细 popup
  const [triggerWlmxPopup, setTriggerWlmxPopup] = useState(false) // 触发物料明细 popup
  /**
   * 强制刷新明细表 用于特殊场景
   */
  const [switche, setswitche] = useState(true);
  const forceupdate = () => { setswitche(false) }
  useEffect(() => { switche ? "1" : setswitche(true) }, [switche])

  const buildTree = (data) => {
    let treeData = []
    //一级分类数据
    let yjfl = data.filter(item => item.sjflid == '000')
    for (let i = 0; i < yjfl.length; i++) {
      //一级分类
      let yjflitem = { title: `(${yjfl[i].flbm})${yjfl[i].flmc}`, key: yjfl[i].flbm, value: yjfl[i].flmc, children: [] }
      //二级分类数据
      let ejfl = data.filter(item => item.sjflbm == yjfl[i].flbm)
      // console.log("ejfl", ejfl)
      for (let j = 0; j < ejfl.length; j++) {
        let ejflitem = { title: `(${ejfl[j].flbm})${ejfl[j].flmc}`, key: ejfl[j].flbm, value: ejfl[j].flmc, children: [] }
        let sjfl = data.filter(item => item.sjflbm == ejfl[j].flbm)
        for (let k = 0; k < sjfl.length; k++) {
          let sjflitem = { title: `(${sjfl[k].flbm})${sjfl[k].flmc}`, key: sjfl[k].flbm, value: sjfl[k].flmc }
          //往二级分类中添加二级分类
          ejflitem.children.push(sjflitem)
        }
        //往一级分类中添加二级分类
        yjflitem.children.push(ejflitem)
      }
      treeData.push(yjflitem)
    }
    return treeData
  };

  const unique = (arr) => {  
    return arr.reduce((acc, current) => {  
        if(acc.indexOf(current) === -1) {  
            acc.push(current);  
        }  
        return acc;  
    }, []);  
  }


  const init = async () => {
    setisloading(true)
    let rtdata = await fetchsync_util("/admin/baseinfo/wlfllb", 'POST', {}, "json")
    // console.log("rtdata", rtdata)
    var treedata = buildTree(rtdata.resultdata);
    var dictObj = await use_dict_byzdmc(["dict_zbxs", "dict_jjgz", "dict_wjlx", "dict_cyqx"])
    var bbObj = await use_olreport_bybbbm(["query_ry", "query_gys", "query_wl"])
    dynDatasObject.dict_zbxs = dictObj.dict_zbxs
    dynDatasObject.dict_jjgz = dictObj.dict_jjgz
    dynDatasObject.dict_wjlx = dictObj.dict_wjlx
    dynDatasObject.dict_cyqx = dictObj.dict_cyqx
    dynDatasObject.query_ry = bbObj.query_ry
    dynDatasObject.query_gys = bbObj.query_gys
    dynDatasObject.query_wl = bbObj.query_wl

    formdata.zbpl.selectdata = treedata
    setdynDatasObject({ ...dynDatasObject })
    setisloading(false)
  }

  //主表数据
  const [formdata, setformdata] = useState(JSON.parse(storage.pre_xmjj_item).type != "view" ? use_xmjj_initformdata : use_xmjj_initformdata_view)
  const { setnowroute, collapsed } = useStore();

  // 供应商名称转换
  const transformSuppliers = (data) => {
    // 创建一个空的映射对象
    const supplierMap = {};
    // 创建一个字母表，用于生成供应商名称的后缀
    const alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
    let supplierIndex = 0;

    // 遍历原始数组，生成映射
    data.forEach(supplier => {
      if (!supplierMap[supplier.gysmc]) {
        // 生成新的供应商名称
        const supplierName = `供应商${alphabet[supplierIndex % alphabet.length]}`;
        supplierMap[supplier.gysmc] = supplierName;
        supplierIndex++;
      }
    });
    console.log(supplierMap, "supplierMap");
    setSupplierMap(supplierMap)
  }

  //加载主表数据
  const loadformdata = async (id) => {
    let rtdata = await fetchsync_util("/admin/zbzx/query_xm_byid", 'POST', { id }, "json")
    if (!rtdata.rtstatus) {
      openNotification_util("该项目不存在")
      return
    }
    rtdata.resultdata.formdata.create_time = rtdata.resultdata.formdata.create_time ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.create_time) : ""
    rtdata.resultdata.formdata.update_time = rtdata.resultdata.formdata.update_time ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.update_time) : ""
    rtdata.resultdata.formdata.sqsj = rtdata.resultdata.formdata.sqsj ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.sqsj) : ""
    rtdata.resultdata.formdata.fbsj = rtdata.resultdata.formdata.fbsj ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.fbsj) : ""
    rtdata.resultdata.formdata.ybjzsj = rtdata.resultdata.formdata.ybjzsj ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.ybjzsj) : ""
    rtdata.resultdata.formdata.tbjzsj = rtdata.resultdata.formdata.tbjzsj ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.tbjzsj) : ""
    rtdata.resultdata.formdata.kbsj = rtdata.resultdata.formdata.kbsj ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.kbsj) : ""
    rtdata.resultdata.formdata.pbjssj = rtdata.resultdata.formdata.pbjssj ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.pbjssj) : ""
    rtdata.resultdata.formdata.pbkssj = rtdata.resultdata.formdata.pbkssj ? convertISODateTimeToYYYYMMDDHHMMSS(rtdata.resultdata.formdata.pbkssj) : ""
    // rtdata.resultdata.formdata.gfkj = rtdata.resultdata.formdata.gfkj ? rtdata.resultdata.formdata.gfkj.split(",") : []
    // rtdata.resultdata.formdata.xfkj = rtdata.resultdata.formdata.xfkj ? rtdata.resultdata.formdata.xfkj.split(",") : []
    setformdata({ ...formdata, ...resultdata_to_formdata(rtdata.resultdata.formdata, formdata) });
    const processedWlmxdata = addkey_for_mxdata(rtdata.resultdata.wlmxdata)
    const processedGysmxdata = addkey_for_mxdata(rtdata.resultdata.gysmxdata.map(item => {
      item.xzgys = item.gysmc
      return item
    }))
    
    // 从明细数据中提取 id，设置到 formdata 的 wlmxid 和 gysmxid 字段
    const wlmxidValue = processedWlmxdata.map(item => item.wlbm || item.id).filter(Boolean).join(",")
    const gysmxidValue = processedGysmxdata.map(item => item.gysid || item.id).filter(Boolean).join(",")
    
    setwlmxdata(processedWlmxdata)
    setzbmxdata(addkey_for_mxdata(rtdata.resultdata.zbmxdata))
    setgysmxdata(processedGysmxdata)
    setfjmxdata(addkey_for_mxdata(rtdata.resultdata.fjmxdata))
    setpbmddata(addkey_for_mxdata(rtdata.resultdata.pbmddata))
    
    // 更新 formdata 的 id 字段
    const updatedFormdata = { ...formdata, ...resultdata_to_formdata(rtdata.resultdata.formdata, formdata) }
    if (updatedFormdata.wlmxid) {
      updatedFormdata.wlmxid = { ...updatedFormdata.wlmxid, value: wlmxidValue }
    }
    if (updatedFormdata.gysmxid) {
      updatedFormdata.gysmxid = { ...updatedFormdata.gysmxid, value: gysmxidValue }
    }
    setformdata(updatedFormdata)
    // transformSuppliers(rtdata.resultdata.bjmxdata)
    setgysbjdata(addkey_for_mxdata(rtdata.resultdata.bjmxdata.map((item) => {
      item.bjsj = item.bjsj ? convertISODateTimeToYYYYMMDDHHMMSS(item.bjsj) : ""
      return item
    })))
    setgysfjdata(addkey_for_mxdata(rtdata.resultdata.gysfjmxdata.map((item) => {
      item.gys_fjscsj = item.gys_fjscsj ? convertISODateTimeToYYYYMMDDHHMMSS(item.gys_fjscsj) : ""
      return item
    })))
  }

  // 页面进入加载数据
  useEffect(() => {
    if (JSON.parse(storage.pre_xmjj_item).type == "edit" && JSON.parse(storage.pre_xmjj_item).data.xmzt == "待发布") {
      loadformdata(JSON.parse(storage.pre_xmjj_item).data.id)
      setgysmxcolums(use_xmjj_gysmx_column_initformdata())
      init()
    }
    else if (JSON.parse(storage.pre_xmjj_item).type == "add") {
      init()
      setgysmxcolums(use_xm_gysmx_column_initformdata_add())
    }
    else if (JSON.parse(storage.pre_xmjj_item).data.xmzt == "竞价结束") {
      loadformdata(JSON.parse(storage.pre_xmjj_item).data.id)
      setwlmxcolums(view_item_util(use_xmjj_wlmx_column_initformdata()))
      setfjmxcolums(view_item_util(use_xm_fjmx_column_initformdata()))
      setgysmxcolums(view_item_util(use_xmjj_gysmx_column_initformdata()))
      setzbmxcolums(view_item_util(use_xm_zbmx_column_initformdata()))
      setgysfjcolums(view_item_util(use_xm_gysfj_column_initformdata()))
      setpbmdcolums(view_item_util(use_xm_pbmd_column_initformdata()))
      setisloading(false)
    }
    else {
      init()
      loadformdata(JSON.parse(storage.pre_xmjj_item).data.id)
      setwlmxcolums(view_item_util(use_xmjj_wlmx_column_initformdata()))
      setfjmxcolums(view_item_util(use_xm_fjmx_column_initformdata()))
      setgysmxcolums(view_item_util(use_xmjj_gysmx_column_initformdata()))
      setzbmxcolums(view_item_util(use_xm_zbmx_column_initformdata()))
      setgysfjcolums(view_item_util(use_xm_gysfj_column_initformdata()))
      setpbmdcolums(view_item_util(use_xm_pbmd_column_initformdata()))
      setisloading(false)
    }
  }, [])

  useEffect(() => {
    let newformdata = formdata
    //如果是竞价，根据项目状态显示竞价方面字段
    //如果不是查看，且项目状态为待发布、待应标、待竞价，显示竞价方面字段
    if (JSON.parse(storage.pre_xmjj_item).type != "view" && (formdata.xmzt.value == "待发布" || formdata.xmzt.value == "待应标" ||
      formdata.xmzt.value == "待竞价")) {
      //竞价方面字段
      newformdata.jj_title.inputType = "title_item"
      newformdata.jjls.inputType = "input_number_item"
      newformdata.jjls.bt = true
      newformdata.mlcx.inputType = "input_number_item"
      newformdata.mlcx.bt = true
      newformdata.mljg.inputType = "input_number_item"
      newformdata.mljg.bt = true
      //询价方面字段
      newformdata.ybjzsj.inputType = "date_item"
      newformdata.ybjzsj.bt = true
      newformdata.kbsj.inputType = "date_item"
      newformdata.kbsj.bt = false
      // newformdata.xfkj.inputType = "select_item_mutiple"
      newformdata.gysbmjj.inputType = "select_item"
      newformdata.xmfbmjj.inputType = "select_item"
      newformdata.jjgz.inputType = "select_item_new"
      newformdata.jjgz.bt = true
      wlmxcolums.forEach(item => {
        if (item.dataIndex == "blje" || item.dataIndex == "qsj") {
          item.bt = true
          item.inputType = "input_number_item"
        }
        if (item.dataIndex == "bdj") {
          item.bt = false
          item.inputType = "none"
        }
      })

      // newformdata.blJe.inputType = "input_item"
      // newformdata.blJe.bt = true
    }
    //竞价方面字段改成只读
    else {
      //竞价方面字段
      newformdata.jj_title.inputType = "title_item"
      newformdata.jjls.inputType = "view_item"
      newformdata.jjls.bt = false
      newformdata.mlcx.inputType = "view_item"
      newformdata.mlcx.bt = false
      newformdata.mljg.inputType = "view_item"
      newformdata.mljg.bt = false
      //询价方面字段
      newformdata.ybjzsj.inputType = "view_item"
      newformdata.ybjzsj.bt = false
      newformdata.kbsj.inputType = "view_item"
      newformdata.kbsj.bt = false
      // newformdata.xfkj.inputType = "view_item"
      newformdata.gysbmjj.inputType = "view_item"
      newformdata.xmfbmjj.inputType = "view_item"
      newformdata.jjgz.inputType = "view_item"
      newformdata.jjgz.bt = false
      wlmxcolums.forEach(item => {
        if (item.dataIndex == "blje") {
          item.bt = false
        }
      })

      // newformdata.blJe.inputType = "view_item"
      // newformdata.blJe.bt = false
    }

    //如果项目已发布或者提交审核或者审核通过，不允许编辑项目
    if (formdata.xmzt.value != "待发布" || formdata.shzt.value == "审核通过" || formdata.shzt.value == "待审核") {
      newformdata.create_by.inputType = "view_item"
      newformdata.create_time.inputType = "view_item"
      newformdata.update_by.inputType = "view_item"
      newformdata.update_time.inputType = "view_item"
      newformdata.xmzt.inputType = "view_item"
      newformdata.xmbh.inputType = "view_item"
      newformdata.xmmc.inputType = "view_item"
      newformdata.zbpl.inputType = "view_item"
      // newformdata.cgpl.inputType = "view_item"
      newformdata.zbxs.inputType = "view_item"
      // newformdata.sqsj.inputType = "view_item"
      newformdata.fbsj.inputType = "view_item"
      newformdata.zbzrr.inputType = "view_item"
      newformdata.lxfs.inputType = "view_item"
      newformdata.ybjzsj.inputType = "view_item"
      // newformdata.tbjzsj.inputType = "view_item"
      newformdata.kbsj.inputType = "view_item"
      newformdata.xmjj.inputType = "view_text_item"
    }

    setformdata({ ...newformdata })
    if (JSON.parse(storage.pre_xmjj_item).type == "edit" && JSON.parse(storage.pre_xmjj_item).data.xmzt == "待发布") {
      setwlmxcolums(wlmxcolums)
    }
    else if (JSON.parse(storage.pre_xmjj_item).type == "add") {
      setwlmxcolums(wlmxcolums)
    }
    else if (JSON.parse(storage.pre_xmjj_item).data.xmzt == "竞价结束") {
      setwlmxcolums(view_item_util(wlmxcolums))
    }
    else {
      setwlmxcolums(view_item_util(wlmxcolums))
      if (formdata.zbxs.value == "询价") {
        setgysmxcolums(use_xm_gysmx_column_initformdata_add())
      }
    }
    setswitche(false)

  }, [formdata.zbxs.value, formdata.xmzt.value])


  //设置value
  const setfield = (onekey, value, settype) => {
    if (settype == 'single') {
      if (onekey == "zbpl") {
        var newitem = formdata[onekey]
        newitem.value = value.value
        let newformdata = Object.assign({}, formdata, { [onekey]: newitem });
        setformdata(newformdata)
      }
      else {
        var newitem = formdata[onekey]
        newitem.value = value
        let newformdata = Object.assign({}, formdata, { [onekey]: newitem });
        setformdata(newformdata)
      }
    }
    else if (settype == "muti") {
      let [tansferarr, selectrow, newformdata] = [onekey, value, {}];
      tansferarr.forEach(item => {
        var newitem = formdata[item.target]
        newitem.value = selectrow ? selectrow[item.origin] : ""
        newformdata = Object.assign({}, formdata, { [item.target]: newitem });
      })
      setformdata(newformdata)
    }
    else if (settype == "muti-free") {

      var tansferarr = onekey;
      var selectrow = value;
      var newformdata = {}
      console.log(selectrow, "==================selectrow");

      // 添加防护检查，确保 selectrow 是数组
      if (!selectrow || !Array.isArray(selectrow)) {
        console.warn("selectrow 不是数组:", selectrow);
        return;
      }

      tansferarr.forEach(item => {
        var newitem = formdata[item.target]

        // 对于 wlmx 字段，不使用 unique 去重，保留所有物料名称（即使同名，因为 wlbm 不同）
        // 对于其他字段，使用 unique 去重
        if (item.target === 'wlmx') {
          newitem.value = selectrow.map((item2 => item2[item.origin])).join(",")
        } else {
          newitem.value = unique(selectrow.map((item2 => item2[item.origin]))).join(",")
        }
        newformdata = Object.assign({}, formdata, { [item.target]: newitem });
      })

      // 根据当前操作的字段来判断处理哪种明细数据
      const currentField = tansferarr[0]?.target;
      
      if (currentField === 'wlmx') {
        // 1. 从 selectrow 中提取 wlbm 列表
        const selectedWlbmList = selectrow.map(item => item.wlbm).filter(Boolean)
        
        // 2. 找出需要添加的新记录
        let wlmxlist_add = []
        selectrow.forEach(datai => {
          if (!wlmxdata.some(item => item.wlbm == datai.wlbm)) {
            var newData = { key: datai.wlbm }
            wlmxcolums.forEach(item => {
              newData[item.dataIndex] = item.defalut_v
            })
            const uniqueId = uuidv4();

            newData.id = uniqueId
            newData.key = uniqueId
            newData.index = uniqueId

            newData.wlbm = datai.wlbm
            newData.wlmc = datai.wlmc
            newData.ggxh = datai.ggxh
            newData.dw = datai.dw

            wlmxlist_add.push(newData)
          }
          else{
              // openNotification_util("物料已存在")
          }
        })
        
        // 3. 找出需要移除的记录（在明细表中但不在 selectrow 中）
        const recordsToRemove = wlmxdata.filter(item => 
          item.wlbm && !selectedWlbmList.includes(item.wlbm)
        )
        
        // 4. 将被移除记录的 id 加入删除数组
        const idsToDelete = recordsToRemove.map(item => item.id).filter(Boolean)
        if (idsToDelete.length > 0) {
          setwlmxdelidarr([...wlmxdelidarr, ...idsToDelete])
        }
        
        // 5. 更新明细表：保留匹配的记录 + 新添加的记录
        const updatedWlmxdata = [
          ...wlmxdata.filter(item => selectedWlbmList.includes(item.wlbm)),
          ...wlmxlist_add
        ].map((item, i) => ({ ...item, xuhao: i + 1 }))
        
        // 6. 更新 wlmxid 字段
        const wlmxidValue = updatedWlmxdata.map(item => item.wlbm || item.id).filter(Boolean).join(",")
        if (formdata.wlmxid) {
          newformdata.wlmxid = { ...formdata.wlmxid, value: wlmxidValue }
        }
        
        setformdata(newformdata)
        //装载新配置的数据
        setwlmxdata(updatedWlmxdata)
      }
      else if (currentField === 'gysmx') {
        // 1. 从 selectrow 中提取匹配标识（优先 gysid，其次 gysmc）
        const selectedGysIds = selectrow.map(item => item.value || item.gysid).filter(Boolean)
        const selectedGysNames = selectrow.map(item => item.gysmc).filter(Boolean)
        
        // 2. 找出需要添加的新记录
        let gysmxlist_add = []
        selectrow.forEach(datai => {
          // 检查 gysmc 或 gysid 是否重复
          const isDuplicate = gysmxdata.some(item => 
            (item.gysmc && datai.gysmc && item.gysmc == datai.gysmc) || 
            (item.gysid && datai.value && item.gysid == datai.value)
          )
          
          if (!isDuplicate) {
            var newData = { key: datai.gysmc }
            gysmxcolums.forEach(item => {
              newData[item.dataIndex] = item.defalut_v
            })
            const uniqueId = uuidv4();
            newData.id = uniqueId
            newData.key = uniqueId
            newData.index = uniqueId
            newData.gysmc = datai.gysmc
            newData.xzgys = datai.gysmc
            newData.gysid = datai.value
            // popup 返回的字段是 xysbdm，需要映射到 shtyxydm
            newData.shtyxydm = datai.xysbdm || datai.shtyxydm || ""
            newData.lxr = datai.lxr || ""
            newData.lxdh = datai.sj || ""
            // newData.zh = datai.zh
            // newData.mm = datai.mm
            // newData.yqlj = `${datai.gysmc},您好！请访问网址：http://bidserver.hicon.cn:6132/ 参与竞价竞标，您的账号:${datai.zh} 密码:${datai.mm}，请妥善保管`;
            gysmxlist_add.push(newData)
          }
          else{
              // openNotification_util(`供应商已存在：${datai.gysmc || datai.value}`)
          }
        })
        
        // 3. 找出需要移除的记录（优先通过 gysid 匹配，其次 gysmc）
        const recordsToRemove = gysmxdata.filter(item => {
          const hasGysId = item.gysid && selectedGysIds.includes(String(item.gysid))
          const hasGysName = !item.gysid && item.gysmc && selectedGysNames.includes(item.gysmc)
          return !hasGysId && !hasGysName
        })
        
        // 4. 将被移除记录的 id 加入删除数组
        const idsToDelete = recordsToRemove.map(item => item.id).filter(Boolean)
        if (idsToDelete.length > 0) {
          setgysmxdelidarr([...gysmxdelidarr, ...idsToDelete])
        }
        
        // 5. 更新明细表：保留匹配的记录 + 新添加的记录
        const updatedGysmxdata = [
          ...gysmxdata.filter(item => {
            const hasGysId = item.gysid && selectedGysIds.includes(String(item.gysid))
            const hasGysName = !item.gysid && item.gysmc && selectedGysNames.includes(item.gysmc)
            return hasGysId || hasGysName
          }),
          ...gysmxlist_add
        ].map((item, i) => ({ ...item, xuhao: i + 1 }))
        
        // 6. 更新 gysmxid 字段
        const gysmxidValue = updatedGysmxdata.map(item => item.gysid || item.id).filter(Boolean).join(",")
        if (formdata.gysmxid) {
          newformdata.gysmxid = { ...formdata.gysmxid, value: gysmxidValue }
        }
        
        setformdata(newformdata)
        //装载新配置的数据
        setgysmxdata(updatedGysmxdata)
      }
      else {
        // 其他字段的处理
        setformdata(newformdata)
      }

    }

  }

  // 根据明细数据同步更新 formdata 字段
  const syncFormdataFromMxdata = (mxdata, mxType) => {
    const newformdata = { ...formdata }
    
    if (mxType === 'wlmx') {
      // 根据当前明细数据重新生成 wlmx 和 wlmxid 字段值
      const wlmcList = mxdata.map(item => item.wlmc).filter(Boolean)
      const wlmxidList = mxdata.map(item => item.wlbm || item.id).filter(Boolean)
      
      if (formdata.wlmx) {
        newformdata.wlmx = { ...formdata.wlmx, value: wlmcList.join(",") }
      }
      if (formdata.wlmxid) {
        newformdata.wlmxid = { ...formdata.wlmxid, value: wlmxidList.join(",") }
      }
    } else if (mxType === 'gysmx') {
      // 根据当前明细数据重新生成 gysmx 和 gysmxid 字段值
      const gysmcList = mxdata.map(item => item.gysmc).filter(Boolean)
      const gysmxidList = mxdata.map(item => item.gysid || item.id).filter(Boolean)
      
      if (formdata.gysmx) {
        newformdata.gysmx = { ...formdata.gysmx, value: gysmcList.join(",") }
      }
      if (formdata.gysmxid) {
        newformdata.gysmxid = { ...formdata.gysmxid, value: gysmxidList.join(",") }
      }
    }
    
    setformdata(newformdata)
  }

  const handleupload = async () => {

    var checkobj = checkdatavalid_util_formdata(formdata)
    // 主表字段校验没通过不能保存，目前没写子表校验。

    if (!checkobj.rtstatus) { openNotification_util(checkobj.rtmessage); return; }
    else;

    if (formdata.zbxs.value == "投标") {
      if (new Date(formdata.pbkssj.value).getTime() > new Date(formdata.pbjssj.value).getTime()) {
        openNotification_util("评标结束时间必须大于评标开始时间");
        return;
      }
      if (formdata.swbqz.value + formdata.jsbqz.value != 1) {
        openNotification_util("商务标和技术标权重之和必须为1");
        return;
      }
      if (fjmxdata.filter(item => item.wjlx == "技术标书").length == 0 || fjmxdata.filter(item => item.wjlx == "商务标书").length == 0) {
        openNotification_util("技术标书和商务标书都至少有一项");
        return;
      }
    }
    if (new Date(formdata.fbsj.value).getTime() > new Date(formdata.ybjzsj.value).getTime()) {
      openNotification_util("应标截止时间必须大于发布时间");
      return;
    }
    // 正则表达式：匹配整数
    const Numberregex = /^\d+$/;
    if (formdata.mlcx.bt == true && formdata.mlcx.value && !Numberregex.test(formdata.mlcx.value)) {
      openNotification_util("每轮持续必须为整数");
      return;
    }
    if (formdata.mljg.bt == true && formdata.mljg.value && !Numberregex.test(formdata.mljg.value)) {
      openNotification_util("每轮间隔必须为整数");
      return;
    }
    if (formdata.jjls.bt == true && formdata.jjls.value && !Numberregex.test(formdata.jjls.value)) {
      openNotification_util("竞价轮数必须为整数");
      return;
    }
    // 正则表达式：匹配整数或浮点数，后面可以有一个可选的百分号
    // const regex = /^\d+(\.\d+)?(\%)?$/;
    // if (formdata.zbxs.value == "竞价" && !regex.test(formdata.blJe.value)) {
    //   openNotification_util("竞价方面字段校验必须是百分比的数字或者数字");
    //   return;
    // }
    if (gysmxdata.some(item => item.xzgys === "")) {
      let str = ""
      let lsGyslb = gysmxdata.filter(item => item.xzgys === "")
      for (let i = 0; i < lsGyslb.length; i++) {
        let item = lsGyslb[i]
        if (item.gysmc == "") {
          str += `第${item.xuhao}行供应商名称不能为空;`
        }
        else {
          if (item.lxdh == "") {
            str += `第${item.xuhao}行临时供应商：${item.gysmc}的联系电话不能为空;`
          }
        }
      }
      if (str != "") {
        openNotification_util(str);
        return;
      }
    }


    // 拼接明细
    var newwlmxdatalist = combile_mxdata_mxcol_util(wlmxdata, wlmxcolums)
    var newzbmxdatalist = combile_mxdata_mxcol_util(zbmxdata, zbmxcolums)
    var newgysmxdatalist = combile_mxdata_mxcol_util(gysmxdata, gysmxcolums)
    var newpbmddatalist = combile_mxdata_mxcol_util(pbmddata, pbmdcolums)
    var newfjmxdatalist = combile_mxdata_mxcol_util(fjmxdata, fjmxcolums)
    if (!checkdatavalid_util_formdata_mx(newwlmxdatalist)) {
      openNotification_util("物料明细必填校验不通过，无法保存")
      return
    }
    // 比例或金额校验
    const regex = /^\d+(\.\d+)?(\%)?$/;
    if (wlmxdata.some(item => item.blje && !regex.test(item.blje))) {
      openNotification_util("比例或金额字段校验必须是百分比的数字或者数字");
      return;
    }


    //设置submit url
    var uploadurl = JSON.parse(storage.pre_xmjj_item).type == "add" ?
      "/admin/zbzx/add_xm" : "/admin/zbzx/update_xm";
    let rtdata = await fetchsync_util(uploadurl, 'POST', {
      formdata, wlmxdata: newwlmxdatalist, zbmxdata: newzbmxdatalist,
      gysmxdata: newgysmxdatalist, fjmxdata: newfjmxdatalist, pbmddata: newpbmddatalist, wlmxdelidarr, zbmxdelidarr, gysmxdelidarr, fjmxdelidarr, pbmddelidarr
    }, "json")
    rtdata.rtstatus ? openNotification_util(rtdata.rtmessage) : 1
    // setformdata(rtdata.resultdata.formdata);

    dropByCacheKey('xmjj_list')
    dropByCacheKey('xmjj_form')
    setnowroute({ route: "/shipSRM/zbzx/xmjj_list", title: "竞价项目", closeroute: "/shipSRM/zbzx/xmjj_form" })

  }



  const renderfileditem = () => {
    var formdataarr = []
    for (var formitemkey in formdata) {
      formdata[formitemkey].inputType == "none" ? "" : formdataarr.push(formdata[formitemkey])
    }
    var renderstr = formdataarr.map(item => {
      // 为 gysmx 和 wlmx 字段添加已选数据，用于 popup 初始化选中状态
      let itemWithSelectedData = formdata[item.dataIndex]
      if (item.dataIndex === 'gysmx') {
        itemWithSelectedData = {
          ...formdata[item.dataIndex],
          selectedData: gysmxdata.map(gys => ({
            id: gys.id, // 优先使用 id 匹配
            gysmc: gys.gysmc,
            gysid: gys.gysid,
            value: gys.gysid || gys.value
          })),
          matchFields: ['id', 'gysid', 'gysmc'], // 优先使用 id 匹配
          triggerOpen: triggerGysmxPopup, // 传递触发状态
          onTriggered: () => { setTriggerGysmxPopup(false) } // 重置触发状态
        }
      } else if (item.dataIndex === 'wlmx') {
        itemWithSelectedData = {
          ...formdata[item.dataIndex],
          selectedData: wlmxdata.map(wl => ({
            id: wl.id, // 优先使用 id 匹配
            wlbm: wl.wlbm,
            wlmc: wl.wlmc,
            value: wl.wlbm || wl.value
          })),
          matchFields: ['id', 'wlbm'], // 只通过 id 和 wlbm 匹配，不使用 wlmc 避免同名记录被同时选中
          triggerOpen: triggerWlmxPopup, // 传递触发状态
          onTriggered: () => { setTriggerWlmxPopup(false) } // 重置触发状态
        }
      }
      
      var rtitem = item.input_type == "space_item" ?
        <Customfielditem_hook form={formdata} item={{ inputType: "none" }}
          handlechange={(key, value, settype) => { setfield(key, value, settype) }} />
        :
        <Customfielditem_hook form={formdata} item={itemWithSelectedData}
          dynDatasObject={dynDatasObject}
          handlechange={(key, value, settype) => { setfield(key, value, settype) }} />
      return rtitem
    }
    )
    return renderstr
  }

  return (

    <div style={{
      height: "94%", backgroundColor: `#F1F1F1`, right: "1%", top: "5.9vh", overflow: "hidden",
      backgroundSize: "100% 100%", width: collapsed ? "94%" : "84%", position: "absolute", color: "white", fontSize: "0.8rem"
    }}
    data-page-type="form">

      <div style={{width:"100%",height:"100%",backgroundColor:"white",overflow:"auto"}}>
      <div style={{
        width: "100%", height: "7%", position: "sticky", top: "1%", backgroundColor: "white", color: "black", display: "flex",
        zIndex: 105, borderBottom: "2px solid #a91f24"
      }}>


        <div style={{ width: "40%", textAlign: "left", paddingRight: "1rem", display: "flex", alignItems: "center", fontWeight: "600" }}>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          工具栏
        </div>
        {JSON.parse(storage.pre_xmjj_item).type != "view" ?
          <div style={{ width: "60%", textAlign: "right", paddingRight: "1rem" }}>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <Button type="primary" onClick={handleupload}
              style={{ width: "8vw", height: '2.2vw', fontSize: "1vw", borderRadius: "5px", marginTop: "0.4vw" }}>
              <SaveOutlined />保存</Button>

          </div>
          :
          <></>
        }
      </div>

      <div style={styles.kshcontainer}>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap", marginBottom: "2rem"
        }}>
          {renderfileditem()}
        </div>
        {/* 主表区域结束 */}
        {/* 物料明细区域*/}
        <div style={{
          height: "1.2rem", marginLeft: "2%", position: "relative", width: "96%", textIndent: "0.5rem", color: "#666666",
          backgroundColor: "white", lineHeight: "1.2rem", fontSize: "14px", fontWeight: "500", textAlign: "left", borderLeftStyle: "solid",
          borderWidth: "0.3rem", borderColor: "#a91f24", marginTop: "1rem", marginBottom: "0.5rem", letterSpacing: "0.05rem"
        }}>
          物料明细
        </div>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {isloading ?
            (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
            :
            <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
              {switche && <Xm_wlmx_hook colmuns={wlmxcolums} datasource={wlmxdata}
                styleobj={{ height: "70%" }}
                dynDatasObject={dynDatasObject}
                formdata={formdata}
                handledelid={ids => { 
                  if (ids.length !== 0) {
                    setwlmxdelidarr([...wlmxdelidarr, ...ids])
                  }
                }}
                handgetmxdata={(tabledata) => {
                  addkey_for_mxdata(tabledata)
                  setwlmxdata(tabledata)
                }}
                onFormdataSync={(tabledata) => {
                  // 同步更新 formdata 字段
                  syncFormdataFromMxdata(tabledata, 'wlmx')
                }}
                onTriggerWlmxPopup={() => { setTriggerWlmxPopup(true) }}
                ifshowaddbtn={JSON.parse(storage.pre_xmjj_item).type != "view" && formdata.xmzt.value == "待发布" ? true : false}
                handlechangeFormdata={(data) => {
                  setformdata(data)
                }}
                forceupdate={forceupdate}
              />}</div>
          }
        </div>
        
        {/* 供应商明细区域 */}
        <div style={{
          height: "1.2rem", marginLeft: "2%", position: "relative", width: "96%", textIndent: "0.5rem", color: "#666666",
          backgroundColor: "white", lineHeight: "1.2rem", fontSize: "14px", fontWeight: "500", textAlign: "left", borderLeftStyle: "solid",
          borderWidth: "0.3rem", borderColor: "#a91f24", marginTop: "1rem", marginBottom: "0.5rem", letterSpacing: "0.05rem"
        }}>
          供应商明细
        </div>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {isloading ?
            (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
            :
            <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
              {switche && <Xmjj_gysmx_hook colmuns={gysmxcolums} datasource={gysmxdata}
                styleobj={{ height: "70%" }}
                showcz={true}
                dynDatasObject={dynDatasObject}
                formdata={formdata}
                handledelid={ids => { 
                  if (ids.length !== 0) {
                    setgysmxdelidarr([...gysmxdelidarr, ...ids])
                  }
                }}
                handgetmxdata={(tabledata) => {
                  addkey_for_mxdata(tabledata)
                  setgysmxdata(tabledata)
                }}
                onFormdataSync={(tabledata) => {
                  // 同步更新 formdata 字段
                  syncFormdataFromMxdata(tabledata, 'gysmx')
                }}
                onTriggerGysmxPopup={() => { setTriggerGysmxPopup(true) }}
                ifshowaddbtn={false}
                handlechangeFormdata={(data) => {
                  setformdata(data)
                }}
                forceupdate={forceupdate}
              />}</div>
          }
        </div>

        {/* 附件明细区域 */}
        <div style={{
          height: "1.2rem", marginLeft: "2%", position: "relative", width: "96%", textIndent: "0.5rem", color: "#666666",
          backgroundColor: "white", lineHeight: "1.2rem", fontSize: "14px", fontWeight: "500", textAlign: "left", borderLeftStyle: "solid",
          borderWidth: "0.3rem", borderColor: "#a91f24", marginTop: "1rem", marginBottom: "0.5rem", letterSpacing: "0.05rem"
        }}>
          附件明细
        </div>
        <div style={{
          fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
          textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
        }}>
          {isloading ?
            (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
            :
            <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
              {switche && <Xm_fjmx_hook colmuns={fjmxcolums} datasource={fjmxdata}
                styleobj={{ height: "70%" }}
                dynDatasObject={dynDatasObject}
                formdata={formdata}
                handledelid={ids => { ids.length !== 0 ? setfjmxdelidarr([...fjmxdelidarr, ...ids]) : ''; }}
                handgetmxdata={(tabledata) => {
                  addkey_for_mxdata(tabledata)
                  setfjmxdata(tabledata)
                }}
                ifshowaddbtn={JSON.parse(storage.pre_xmjj_item).type != "view" && formdata.xmzt.value == "待发布" ? true : false}
                handlechangeFormdata={(data) => {
                  setformdata(data)
                }}
                forceupdate={forceupdate}
              />}</div>
          }
        </div>

        
        {/* 评标委员明细区域 */}
        {formdata.zbxs.value == '投标' && <><div style={{
          height: "1.2rem", marginLeft: "2%", position: "relative", width: "96%", textIndent: "0.5rem", color: "#666666",
          backgroundColor: "white", lineHeight: "1.2rem", fontSize: "14px", fontWeight: "500", textAlign: "left", borderLeftStyle: "solid",
          borderWidth: "0.3rem", borderColor: "#a91f24", marginTop: "1rem", marginBottom: "0.5rem", letterSpacing: "0.05rem"
        }}>
          评标委员明细
        </div>
          <div style={{
            fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
            textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
          }}>
            {isloading ?
              (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
              :
              <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
                {switche && <Xm_gysmx_hook colmuns={pbmdcolums} datasource={pbmddata}
                  styleobj={{ height: "70%" }}
                  dynDatasObject={dynDatasObject}
                  formdata={formdata}
                  handledelid={ids => { ids.length !== 0 ? setpbmddelidarr([...pbmddelidarr, ...ids]) : ''; }}
                  handgetmxdata={(tabledata) => {
                    addkey_for_mxdata(tabledata)
                    setpbmddata(tabledata)
                  }}
                  ifshowaddbtn={JSON.parse(storage.pre_xmjj_item).type != "view" && formdata.xmzt.value == "待发布" ? true : false}
                  handlechangeFormdata={(data) => {
                    setformdata(data)
                  }}
                  forceupdate={forceupdate}
                />}</div>
            }
          </div></>}
        {/* 供应商附件明细区域 */}
        {JSON.parse(storage.pre_xmjj_item).type != "add" && <><div style={{
          height: "1.2rem", marginLeft: "2%", position: "relative", width: "96%", textIndent: "0.5rem", color: "#666666",
          backgroundColor: "white", lineHeight: "1.2rem", fontSize: "14px", fontWeight: "500", textAlign: "left", borderLeftStyle: "solid",
          borderWidth: "0.3rem", borderColor: "#a91f24", marginTop: "1rem", marginBottom: "0.5rem", letterSpacing: "0.05rem"
        }}>
          供应商附件明细
        </div>
          <div style={{
            fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
            textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
          }}>
            {isloading ?
              (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
              :
              <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
                {switche && <Xm_zbmx_hook colmuns={gysfjcolums} datasource={gysfjdata}
                  styleobj={{ height: "70%" }}
                  dynDatasObject={dynDatasObject}
                  formdata={formdata}
                  handledelid={ids => { ids.length !== 0 ? setgysfjdelidarr([...gysfjdelidarr, ...ids]) : ''; }}
                  handgetmxdata={(tabledata) => {
                    addkey_for_mxdata(tabledata)
                    setgysfjdata(tabledata)
                  }}
                  ifshowaddbtn={false}
                  handlechangeFormdata={(data) => {
                    setformdata(data)
                  }}
                  forceupdate={forceupdate}
                />}</div>
            }
          </div></>}
        {/* 供应商报价明细区域 */}
        {JSON.parse(storage.pre_xmjj_item).type != "add" && <><div style={{
          height: "1.2rem", marginLeft: "2%", position: "relative", width: "96%", textIndent: "0.5rem", color: "#666666",
          backgroundColor: "white", lineHeight: "1.2rem", fontSize: "14px", fontWeight: "500", textAlign: "left", borderLeftStyle: "solid",
          borderWidth: "0.3rem", borderColor: "#a91f24", marginTop: "1rem", marginBottom: "0.5rem", letterSpacing: "0.05rem"
        }}>
          供应商报价明细
        </div>
          <div style={{
            fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
            textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
          }}>
            {isloading ?
              (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
              :
              <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
                {switche && <Xm_zbmx_hook colmuns={gysbjcolums} datasource={gysbjdata}
                  styleobj={{ height: "70%" }}
                  dynDatasObject={dynDatasObject}
                  formdata={formdata}
                  handledelid={ids => { ids.length !== 0 ? setgysbjdelidarr([...gysbjdelidarr, ...ids]) : ''; }}
                  handgetmxdata={(tabledata) => {
                    addkey_for_mxdata(tabledata)
                    setgysbjdata(tabledata)
                  }}
                  handlechangeFormdata={(data) => {
                    setformdata(data)
                  }}
                  supplierMap={supplierMap}
                  ifshowaddbtn={false}
                  forceupdate={forceupdate}
                />}</div>
            }
          </div></>}
        {/* 中标区域 */}
        {JSON.parse(storage.pre_xmjj_item).type != "add" && <><div style={{
          height: "1.2rem", marginLeft: "2%", position: "relative", width: "96%", textIndent: "0.5rem", color: "#666666",
          backgroundColor: "white", lineHeight: "1.2rem", fontSize: "14px", fontWeight: "500", textAlign: "left", borderLeftStyle: "solid",
          borderWidth: "0.3rem", borderColor: "#a91f24", marginTop: "1rem", marginBottom: "0.5rem", letterSpacing: "0.05rem"
        }}>
          中标明细
        </div>
          <div style={{
            fontSize: "0.7rem", position: "relative", width: "96%", marginLeft: "2%", backgroundColor: "", display: "flex",
            textIndent: "1rem", justifyContent: "flex-start", alignContent: "flex-start", flexWrap: "wrap"
          }}>
            {isloading ?
              (<div style={{ width: "10%", height: "10%", position: "absolute", left: "50%", top: "49%", color: "#14d9cc" }}>            <LoadingOutlined /></div>)
              :
              <div style={{ position: "relative", width: "100%", overflowX: "auto", marginBottom: "1rem" }}>
                {switche && <Xm_zbmx_hook colmuns={zbmxcolums} datasource={zbmxdata}
                  styleobj={{ height: "70%" }}
                  dynDatasObject={dynDatasObject}
                  formdata={formdata}
                  handledelid={ids => { ids.length !== 0 ? setzbmxdelidarr([...zbmxdelidarr, ...ids]) : ''; }}
                  handgetmxdata={(tabledata) => {
                    addkey_for_mxdata(tabledata)
                    setzbmxdata(tabledata)
                  }}
                  ifshowaddbtn={false}
                  handlechangeFormdata={(data) => {
                    setformdata(data)
                  }}
                  forceupdate={forceupdate}
                />}</div>
            }
          </div></>}
      </div>
      </div>
    </div>
  )
}


export default Xmjj_form
var styles = {
  maincontainer: {
    height: "100vh", backgroundColor: `white`,
    backgroundSize: "100% 100%", width: "100%", position: "absolute", left: "0", color: "white", fontSize: "0.8rem"
  },
  topcontainer: {
    width: "100%", height: "10vw", backgroundImage: "linear-gradient(to bottom,#e4e5eb , white)", paddingTop: "3vw",
    position: "relative", fontSize: "0.89rem", textIndent: "2rem", fontWeight: "800", color: "#a91f24", borderRadius: "0 0 15px 15px"
  },
  butdcstyle: { paddingLeft: "1vw", paddingRight: "1vw", height: "2vw", position: "absolute", right: "1%", top: "0%", backgroundColor: "#a91f24", fontSize: "0.8vw", borderRadius: "0.4rem", borderRadius: "0 0 0.3vw 0.3vw" },
  butmainstyle: { paddingLeft: "1vw", height: "2vw", position: "absolute", right: "6.5%", top: "0%", backgroundColor: "#a91f24", fontSize: "0.8vw", borderRadius: "0.4rem", borderRadius: "0 0 0.3vw 0.3vw" },
  butbackstyle: { borderRadius: "0.4rem", backgroundColor: "#a91f24", height: "2vw", position: "absolute", right: "12%", top: "0%", fontSize: "0.8vw", borderRadius: "0 0 0.3vw 0.3vw" },
  kshcontainer: {
    width: "98%", position: "relative", backgroundColor: "white", color: "#666",
    borderRadius: "10px", paddingBottom: "2rem", overflow: "visible"
  },
}